// 购物车的显示隐藏

const gw = document.querySelector("#gouwu");
console.log(gw);
const oShop = document.querySelector("#shop");
gw.onmouseenter=()=>{
    oShop.style.display="block";
}
gw.onmouseleave=()=>{
    oShop.style.display="none";
}
// 下拉列表

function Lists(){
    this.li = document.querySelectorAll(".nav-left li");
    this.div = document.querySelectorAll(".nav-bottom div");
    // console.log(this.div);
   this.bianhao();
  
}
Lists.prototype.bianhao = function(){
    for(var i=0;i<this.li.length;i++){
        this.li[i].hao = i;
    }
    this.bangdingshijian();
}
Lists.prototype.bangdingshijian = function(){
    const that = this;
    for(var i=0;i<this.li.length;i++){
        this.li[i].onmouseenter = function(){
            for(var i=0;i<that.li.length;i++){
                that.li[i].className = ""
            }
            this.className = "active";
            that.xianshineirong(this.hao)
        }
    }
}
Lists.prototype.xianshineirong = function(index){
 
    for(var i=0;i<this.div.length;i++){
        this.div[i].style.display = "none";
    }
    this.div[index].style.display = "block";
    this.div[index].onmouseleave=()=>{
        this.div[index].style.display = "none";
       
    }
}
let c=new Lists();
// 轮播图
function Banner(ops){
    this.imgli = ops.imgli;
    this.ol = ops.ol;
    this.left = ops.left;
    this.right = ops.right;
    this.bannerbox = ops.bannerbox;
    this.index = 0; 
    this.lastindex = 0;
    this.t = null;
    this.init();
    this.addEvent();
    this.forword();
}
Banner.prototype.init = function(){
    for(let i = 0; i < this.imgli.length; i++) {
        let oli = document.createElement("li");
        this.ol.appendChild(oli);
    }
    this.ol.children[0].classList.add("active");
}
Banner.prototype.addEvent = function() {
    const that = this;
    this.left.onclick = function() {
        that.computedIndex("left"); 
    }
    this.right.onclick = function() {
        that.computedIndex("right");
    }
    for(let i = 0; i < this.ol.children.length; i++){
        this.ol.children[i].onclick = function(){
            that.lastindex = that.index;lastindex
            that.index = i;
            that.change();
        }
    }
}
Banner.prototype.forword = function() {
    const that = this;
    if(this.t){
        clearInterval(this.t);
    }else {
        this.t = setInterval(()=>{
            that.right.onclick();
        },1500)
    }
    this.bannerbox.onmouseenter = function(){
        clearInterval(that.t);
    }
    this.bannerbox.onmouseleave = function(){
        that.t = setInterval(()=>{
            that.right.onclick();
        },3000)
    }
}
Banner.prototype.computedIndex = function(f) {
    if(f == "left"){
        this.lastindex = this.index;
        if(this.index == 0) {
            this.index = this.imgli.length-1;
        }else{
            this.index--;
        }
        this.change();
    }else{ 
        this.lastindex = this.index;
        if(this.index == this.imgli.length-1) {
            this.index = 0;
        }else{
            this.index++;
        }
        this.change();
    }
}
Banner.prototype.change = function() {
    this.imgli[this.lastindex].classList.remove("active");
    this.imgli[this.index].classList.add("active");
    this.ol.children[this.lastindex].classList.remove("active");
    this.ol.children[this.index].classList.add("active");

}
var a = new Banner({
     imgli : document.querySelectorAll(".banner img"),
     ol : document.querySelector(".banner-dian ul"),
     left : document.querySelector(".btn-left"),
     right : document.querySelector(".btn-right"),
     bannerbox : document.querySelector("#banner")
});

// 楼层
  $(document).scroll(function(){
    if($(document).scrollTop() > 600){
        $("#aside").show()
    }else{
        $("#aside").hide()
    }
})
$("#aside").children("div").click(function(){
    $("html").animate({scrollTop: $(".gun").eq($(this).index()-1).offset().top-50})
    // console.log($(".gun").eq($(this).index()))
})

// 下拉列表
const obox=document.querySelector(".box");
const box0=document.querySelector(".box0");
const boxli=document.querySelectorAll(".box0 div");
let f=1;
obox.onclick=function(eve){
 const e=eve||window.event;
 e.stopPropagation();
 if(f==1){
     box0.style.display="block";
     f=2;
    }else{
     box0.style.display="none";
     f=1;
 }
}
document.onclick=function(){     
box0.style.display="none";
f=1;
}
for(let i=0;i<boxli.length;i++){
boxli[i].onmouseenter=function(){
    for(let j=0;j<boxli.length;j++){
        boxli[j].className='';
    }
    this.className="active";
}
boxli[i].onmouseleave=function(){
    this.className="";
}
boxli[i].onclick=function(){
    for(let j=0;j<boxli.length;j++){
        boxli[j].id='';
    }
    this.id="dise";
    obox.value=this.innerHTML;
}
}